<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>产品总览2</title>
    <link rel="stylesheet" href="./src/css/bootstrap.min.css">
    <link rel="stylesheet" href="./src/css/index.css">
    <link rel="stylesheet" href="./src/css/page2.css">
    <script src="./src/js/jquery-1.10.2.min.js"></script>
    <script src="./src/js/setScale.js"></script>
</head>

<body>

    <!-- Modal -->
    <div class="modal " id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document" style="width: 705px;">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="myModalLabel">企业列表</h4>
                </div>
                <div class="modal-body">
                    <div class="table-box">
                        <table>
                            <colgroup>
                                <col style="width: 60px">
                                <col>
                            </colgroup>
                            <thead>
                                <tr>
                                    <td>
                                        序号
                                    </td>
                                    <td>企业名称</td>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>1</td>
                                    <td>浙江卫信生物药业有限公司</td>
                                </tr>
                                <tr>
                                    <td>1</td>
                                    <td>浙江卫信生物药业有限公司</td>
                                </tr>
                                <tr>
                                    <td>1</td>
                                    <td>浙江卫信生物药业有限公司</td>
                                </tr>
                                <tr>
                                    <td>1</td>
                                    <td>浙江卫信生物药业有限公司</td>
                                </tr>
                                <tr>
                                    <td>1</td>
                                    <td>浙江卫信生物药业有限公司</td>
                                </tr>
                                <tr>
                                    <td>1</td>
                                    <td>浙江卫信生物药业有限公司</td>
                                </tr>
                                <tr>
                                    <td>1</td>
                                    <td>浙江卫信生物药业有限公司</td>
                                </tr>
                                <tr>
                                    <td>1</td>
                                    <td>浙江卫信生物药业有限公司</td>
                                </tr>
                                <tr>
                                    <td>1</td>
                                    <td>浙江卫信生物药业有限公司</td>
                                </tr>
                                <tr>
                                    <td>1</td>
                                    <td>浙江卫信生物药业有限公司</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="modal-footer">
                    <div class="pager2" id="J_pager2" style="clear: both;">
                        <ul class="pager" style="float: left;">
                            <li class="disabled"><a data-ac="first" data-page="1" href="#pager2-url-cache=1"
                                    title="转到第 1 页">首页</a></li>
                            <li class="disabled"><a data-ac="prev" data-page="1" href="#pager2-url-cache=1"
                                    title="转到第 1 页">上页</a></li>
                            <li class="active"><a data-ac="page" data-page="1" href="#pager2-url-cache=1"
                                    title="转到第 1 页">1</a></li>
                            <li class=""><a data-ac="page" data-page="2" href="#pager2-url-cache=2"
                                    title="转到第 2 页">2</a></li>
                            <li class=""><a data-ac="next" data-page="2" href="#pager2-url-cache=2"
                                    title="转到第 2 页">下页</a></li>
                            <li class=""><a data-ac="last" data-page="2" href="#pager2-url-cache=2"
                                    title="转到第 2 页">尾页</a></li>
                        </ul>
                        <ul class="pager" style="float: right;">
                            <li class="disabled"><span class="label label-default">16条 1/2页</span></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="modal " id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel2">
        <div class="modal-dialog" role="document" style="width: 1015px;">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="">详细信息</h4>
                </div>
                <div class="modal-body">
                    <div class="table3">
                        <table>
                            <tbody>
                                <colgroup>
                                    <col style="width: 155px;">
                                    <col>
                                    <col style="width: 155px;">
                                    <col>
                                </colgroup>
                                <tr>
                                    <td>企业名称</td>
                                    <td>艾美卫信生物药业（浙江）有限公司</td>
                                    <td>生产许可证编号</td>
                                    <td>浙20040181</td>
                                </tr>
                                <tr>
                                    <td>企业名称</td>
                                    <td>艾美卫信生物药业（浙江）有限公司</td>
                                    <td>生产许可证编号</td>
                                    <td>浙20040181</td>
                                </tr>
                                <tr>
                                    <td>企业名称</td>
                                    <td>艾美卫信生物药业（浙江）有限公司</td>
                                    <td>生产许可证编号</td>
                                    <td>浙20040181</td>
                                </tr>
                                <tr>
                                    <td>企业名称</td>
                                    <td>艾美卫信生物药业（浙江）有限公司</td>
                                    <td>生产许可证编号</td>
                                    <td>浙20040181</td>
                                </tr>
                                <tr>
                                    <td>生产地址</td>
                                    <td colspan="3">艾美卫信生物药业（浙江）有限公司</td>

                                </tr>
                                <tr>
                                    <td>生产范围</td>
                                    <td colspan="3">双价肾综合征出血热灭活疫苗（Vero细胞），腮腺炎减毒活疫苗，ACYW135群脑膜炎球菌多糖疫苗，吸附无细胞百白破联合疫苗***
                                    </td>

                                </tr>
                            </tbody>
                        </table>
                    </div>

                    <div class="table4">
                        <table>
                            <colgroup>
                                <col style="width:60px;">
                                <col>
                                <col style="width: 108px;">
                                <col style="width: 134px;">
                                <col style="width: 88px;">
                                <col style="width: 78px;">
                                <col style="width: 126px;">
                            </colgroup>
                            <thead>
                                <tr>
                                    <td>序号</td>
                                    <td>产品名称</td>
                                    <td>批准文号</td>
                                    <td>规格</td>
                                    <td>产品类别</td>
                                    <td>剂型</td>
                                    <td>批准日期</td>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>1</td>
                                    <td>双价肾综合征出血热灭活疫苗（Vero细胞）</td>
                                    <td>国药准字S20070020</td>
                                    <td>1.0ml/瓶</td>
                                    <td>生物制品</td>
                                    <td>注射剂</td>
                                    <td>2017-08-21</td>
                                </tr>
                                <tr>
                                    <td>1</td>
                                    <td>双价肾综合征出血热灭活疫苗（Vero细胞）</td>
                                    <td>国药准字S20070020</td>
                                    <td>1.0ml/瓶</td>
                                    <td>生物制品</td>
                                    <td>注射剂</td>
                                    <td>2017-08-21</td>
                                </tr>
                                <tr>
                                    <td>1</td>
                                    <td>双价肾综合征出血热灭活疫苗（Vero细胞）</td>
                                    <td>国药准字S20070020</td>
                                    <td>1.0ml/瓶</td>
                                    <td>生物制品</td>
                                    <td>注射剂</td>
                                    <td>2017-08-21</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="modal-footer">

                </div>
            </div>
        </div>
    </div>

    <div class="wrapper">
        <div class="global-content">
            <a href="javascript:;" class="back">
                <img src="./src/img/back-icon.png" alt="">
            </a>
            <header>
                <img src="./src/img/logo.png" alt="">
                <div class="user-info">
                    <p>你好，陈月华</p>
                    <p>
                        <a href="javascript:;"> <img style="width:11px;height: auto;" src="./src/img/key.png" alt="">
                            修改密码</a>
                        <a href="javascript:;"> <img style="width:13px;height: auto" src="./src/img/logout.png" alt="">
                            退出系统</a>
                    </p>
                </div>
            </header>
            <div class="cp-wrapper clearfix">
                <nav class="left-nav">
                    <div class="nav-item">
                        <a href="javascript:;" class="">
                            <span class="img-box sdfx"></span>
                            <span class="badge">1</span>
                            <p>散点风险</p>
                        </a>

                    </div>
                    <div class="nav-item">
                        <a href="javascript:;">
                            <span class="img-box cpfx"></span>
                            <span class="badge">22</span>
                            <p>产品风险</p>
                        </a>

                    </div>
                    <div class="nav-item">
                        <a href="javascript:;">
                            <span class="img-box qyfx"></span>
                            <p>企业风险</p>
                        </a>

                    </div>
                    <div class="nav-item">
                        <a href="javascript:;">
                            <span class="img-box lyts"></span>
                            <p>领域态势</p>
                        </a>

                    </div>
                    <div class="nav-item">
                        <a href="javascript:;">
                            <span class="img-box qyts"></span>
                            <p>区域态势</p>
                        </a>

                    </div>
                    <div class="nav-item">
                        <a href="javascript:;">
                            <span class="img-box cyzl"></span>
                            <p>产业总览</p>
                        </a>

                    </div>
                </nav>
                <div class="middle-map">
                    <div class="bd-map"></div>
                    <div class="search-box">
                        <a class="tab-it" href="javascript:;">高风险</a>
                        <a class="tab-it" href="javascript:;">其他</a>
                        <div class="search-item hidden" id="searchID">
                            <div class="search-nav-list" id="search-nav-list">
                                <a class="on" href="javascript:;">药品生产</a>
                                <a href="javascript:;">药品经营</a>
                                <a href="javascript:;">医疗器械生产</a>
                                <a href="javascript:;">医疗器械经营</a>
                                <a href="javascript:;">化妆品</a>

                            </div>
                            <table>
                                <tr>
                                    <td>区域：</td>
                                    <td><select class="form-control">
                                            <option>1</option>
                                            <option>2</option>
                                            <option>3</option>
                                            <option>4</option>
                                            <option>5</option>
                                        </select></td>
                                    <td>许可分类：</td>
                                    <td><select class="form-control">
                                            <option>1</option>
                                            <option>2</option>
                                            <option>3</option>
                                            <option>4</option>
                                            <option>5</option>
                                        </select></td>
                                </tr>
                                <tr>
                                    <td>企业名称：</td>
                                    <td>
                                        <input type="text" class="form-control" placeholder="Text input">

                                    </td>
                                    <td>剂型：</td>
                                    <td><select class="form-control">
                                            <option>1</option>
                                            <option>2</option>
                                            <option>3</option>
                                            <option>4</option>
                                            <option>5</option>
                                        </select></td>
                                </tr>
                                <tr>
                                    <td colspan="4">
                                        <button style="background: #2480FF;" type="button" class="btn btn-info"> <img
                                                style="position: relative;top:-2px" src="./src/img/search-icon.png"
                                                alt=""> 查询</button>

                                    </td>
                                </tr>
                            </table>
                        </div>
                    </div>
                </div>
                <div class="right-list">
                    <div class="cp-box-item">
                        <p class="cp-box-item-tit">搜索结果</p>
                        <a class="more" href="javascript:;" data-toggle="modal" data-target="#myModal2">详细分析>></a>
                        <!-- zanwei -->
                        <div style="height: 63px;"></div>
                        <table class="table1">
                            <tbody>
                                <tr>
                                    <td>
                                        <img src="./src/img/res-icon1.png" alt="">
                                        <p>生物制品<span>5</span>家</p>
                                    </td>
                                    <td>
                                        <img src="./src/img/res-icon2.png" alt="">
                                        <p>注射剂<span>5</span>家</p>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="cp-box-item">
                        <p class="cp-box-item-tit">结果列表</p>
                        <a class="more" href="javascript:;" data-toggle="modal" data-target="#myModal">更多>>></a>

                        <!-- zanwei -->
                        <div style="height: 50px;"></div>
                        <div>
                            <table class="table-list">
                                <tbody>
                                    <tr>
                                        <td>浙江卫信生物药业有限公司</td>
                                    </tr>
                                    <tr>
                                        <td>浙江卫信生物药业有限公司</td>
                                    </tr>
                                    <tr>
                                        <td>浙江卫信生物药业有限公司</td>
                                    </tr>
                                    <tr>
                                        <td>浙江卫信生物药业有限公司</td>
                                    </tr>
                                    <tr>
                                        <td>浙江卫信生物药业有限公司</td>
                                    </tr>
                                    <tr>
                                        <td>浙江卫信生物药业有限公司</td>
                                    </tr>
                                    <tr>
                                        <td>浙江卫信生物药业有限公司</td>
                                    </tr>
                                    <tr>
                                        <td>浙江卫信生物药业有限公司</td>
                                    </tr>
                                    <tr>
                                        <td>浙江卫信生物药业有限公司</td>
                                    </tr>
                                    <tr>
                                        <td>浙江卫信生物药业有限公司</td>
                                    </tr>
                                    <tr>
                                        <td>浙江卫信生物药业有限公司</td>
                                    </tr>
                                    <tr>
                                        <td>浙江卫信生物药业有限公司</td>
                                    </tr>
                                    <tr>
                                        <td>浙江卫信生物药业有限公司</td>
                                    </tr>
                                    <tr>
                                        <td>浙江卫信生物药业有限公司</td>
                                    </tr>
                                    <tr>
                                        <td>浙江卫信生物药业有限公司</td>
                                    </tr>
                                    <tr>
                                        <td>浙江卫信生物药业有限公司</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>

                    </div>

                </div>
            </div>

        </div>
    </div>
    <script src="./src/js/bootstrap.min.js"></script>
    <script>
        $('#myModal').on('shown.bs.modal', function () {
            console.log(1)
        })
        $('#myModal2').on('shown.bs.modal', function () {
            console.log(1)
        })
        $('.search-box').on('click', '.tab-it', function () {
            if ($(this).hasClass('on')) {
                $(this).removeClass('on').siblings().removeClass('on');
                $('#searchID').addClass('hidden');
                return
            }
            $(this).addClass('on').siblings().removeClass('on');
            $('#searchID').removeClass('hidden');
            $('#search-nav-list').on('click', 'a', function () {
                $(this).addClass('on').siblings().removeClass('on');

            })
        })
    </script>
</body>

</html>